<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="/layuiadmin/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/layuiadmin/style/admin.css?v={:config('other.ui_version')}" media="all">
</head>
<body>

<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-sm6 layui-col-md3">
            <div class="layui-card" id="p_popUp_a">
                <div class="layui-card-header">
                    <font onmouseover="over('popUp_a')">{:Lang('today_ip')}&nbsp;<img src="/static/help.png" height="14px" width="auto"/> </font>
                    <span class="layui-badge layui-bg-blue layuiadmin-badge">{:Lang('day')}</span>
                </div>
                <div class="layui-card-body layuiadmin-card-list">
                    <p class="layuiadmin-big-font">{$ip_today}</p>
                    <p>
                        {:Lang('yesterday_ip')}
                        <span class="layuiadmin-span-color">{$ip_yesterday} <i class="layui-inline layui-icon layui-icon-fire"></i></span>
                    </p>
                </div>
            </div>
        </div>
        <div class="layui-col-sm6 layui-col-md3">
            <div class="layui-card" id="p_popUp_b">
                <div class="layui-card-header">
                    <font onmouseover="over('popUp_b')">{:Lang('new_users_today')}&nbsp;<img src="/static/help.png" height="14px" width="auto"/></font>
                    <span class="layui-badge layui-bg-blue layuiadmin-badge">{:Lang('day')}</span>
                </div>

                <div class="layui-card-body layuiadmin-card-list">
                    <p class="layuiadmin-big-font">{if $statistics_today}{$statistics_today.regist_ios+$statistics_today.regist_android+$statistics_today.regist_pc} {else/}0{/if}</p>
                    <p>
                        {:Lang('new_users_yesterday')}
                        <span class="layuiadmin-span-color">{if $statistics_yesterday}{$statistics_yesterday.regist_ios+$statistics_yesterday.regist_android+$statistics_yesterday.regist_pc}{else/}0{/if}<i class="layui-inline layui-icon layui-icon-user"></i></span>
                    </p>
                </div>
            </div>
        </div>
        <div class="layui-col-sm6 layui-col-md3">
            <div class="layui-card" id="p_popUp_c">
                <div class="layui-card-header">
                    <font onmouseover="over('popUp_c')">{:Lang('today_active_users')}&nbsp;<img src="/static/help.png" height="14px" width="auto"/></font>
                    <span class="layui-badge layui-bg-blue layuiadmin-badge">{:Lang('day')}</span>
                </div>
                <div class="layui-card-body layuiadmin-card-list">
                    <p class="layuiadmin-big-font">{$active_user}</p>
                    <p>
                        {:Lang('yesterday_active_users')}
                        <span class="layuiadmin-span-color">{$active_user_yesterday}<i class="layui-inline layui-icon layui-icon-user"></i></span>
                    </p>
                </div>
            </div>
        </div>
        <div class="layui-col-sm6 layui-col-md3">
            <div class="layui-card" id="p_popUp_d">
                <div class="layui-card-header">
                    <font onmouseover="over('popUp_d')">{:Lang('current_month_user_summary')}&nbsp;<img src="/static/help.png" height="14px" width="auto"/></font>
                    <span class="layui-badge layui-bg-green layuiadmin-badge">{:Lang('month')}</span>
                </div>
                <div class="layui-card-body layuiadmin-card-list">

                    <p class="layuiadmin-big-font">{$month_ios+$month_android+$month_pc}</p>
                    <p>
                        {:Lang('current_month_active_user_summary')}
                        <span class="layuiadmin-span-color">{$user_count} <i class="layui-inline layui-icon layui-icon-user"></i></span>
                    </p>
                </div>
            </div>
        </div>


        <div class="layui-col-lg12">
            <div class="layui-card">
            <div style="height: 300px;">
                <div class="layui-card-header"><h>五日累计IP</h></div>
                <table cellspacing="0" cellpadding="0" border="0" class="layui-table" lay-even="">
                    <thead><tr><th data-field="date_str" data-key="6-0-0" class=""><div class="layui-table-cell laytable-cell-6-0-0"><span>日期</span></div></th><th data-field="ip_count" data-key="6-0-1" class=""><div class="layui-table-cell laytable-cell-6-0-1"><span>IP个数(总站)</span></div></th><th data-field="device_count" data-key="6-0-2" class=""><div class="layui-table-cell laytable-cell-6-0-2"><span>设备总数(直播间)</span></div></th><th data-field="android_count" data-key="6-0-3" class=""><div class="layui-table-cell laytable-cell-6-0-3"><span>安卓APP设备数(直播间)</span></div></th><th data-field="ios_count" data-key="6-0-4" class=""><div class="layui-table-cell laytable-cell-6-0-4"><span>苹果APP设备数(直播间)</span></div></th><th data-field="pc_count" data-key="6-0-5" class=""><div class="layui-table-cell laytable-cell-6-0-5"><span>访问PC设备数(直播间)</span></div></th><th data-field="h5_count" data-key="6-0-6" class=""><div class="layui-table-cell laytable-cell-6-0-6"><span>访问H5设备数(直播间)</span></div></th></tr></thead>
                    <tbody>
                        <?php foreach($ip_list as $item):?>
                        <tr><td><?php echo date("Y-m-d",strtotime($item["date"]))?></td><td>{$item["ip_count"]}</td><td>{$item["device_count"]}</td><td>{$item["android_count"]}</td><td>{$item["ios_count"]}</td><td>{$item["pc_count"]}</td><td>{$item["h5_count"]}</td></tr>
                        <?php endforeach;?>
                    </tbody>
                </table>
            </div>
            </div>
        </div>
    
         <div class="layui-col-lg12">
            <div class="layui-card">
            <div style="height: 300px;">
                <div class="layui-card-header"><h>五日新增统计</h></div>
                <table cellspacing="0" cellpadding="0" border="0" class="layui-table" lay-even="">
                    <thead><tr><th data-field="date" data-key="1-0-1" class=""><div class="layui-table-cell laytable-cell-1-0-1"><span>日期</span></div></th><th data-key="1-0-1" class=""><div class="layui-table-cell laytable-cell-1-0-1"><span>合计</span></div></th><th data-field="android" data-key="1-0-2" class=""><div class="layui-table-cell laytable-cell-1-0-2"><span>安卓APP</span></div></th><th data-field="ios" data-key="1-0-3" class=""><div class="layui-table-cell laytable-cell-1-0-3"><span>苹果APP</span></div></th><th data-field="web" data-key="1-0-4" class=""><div class="layui-table-cell laytable-cell-1-0-4"><span>PC</span></div></th><th data-field="h5" data-key="1-0-5" class=""><div class="layui-table-cell laytable-cell-1-0-5"><span>H5</span></div></th></tr></thead>
                    <tbody>
                        <?php foreach($use_list as $item):?>
                        <tr><td>{$item["date"]}</td><td>{$item["android"]+$item["ios"]+$item["web"]+$item["h5"]}</td><td>{$item["android"]}</td><td>{$item["ios"]}</td><td>{$item["web"]}</td><td>{$item["h5"]}</td></tr>
                        <?php endforeach;?>
                    </tbody>
                </table>
            </div>
            </div>
        </div> 


    </div>
    <div class="layui-layer layui-layer-dialog" onmouseout="mouseout('popUp_a')" type="dialog" id="popUp_a" times="2" showtime="0" contype="string" style="z-index: 19891016; width: 150px; height: 100px; top: 10px; left: 15px;display: none">
        <!--累计ip-->
        <div class="layui-card-body layuiadmin-card-list">
            <p><strong>{:Lang('today_ip')}</strong></p>
            <p>{:Lang('new_today_ip')}:{$ip_today}</p>
            <p>&nbsp;</p>
            <p><strong>{:Lang('yesterday_ip')}</strong></p>
            <p>{:Lang('new_yesterday_ip')}:{$ip_yesterday}</p>
        </div>
    </div>

    <div class="layui-layer layui-layer-dialog" onmouseout="mouseout('popUp_b')" type="dialog" id="popUp_b" times="2" showtime="0" contype="string" style="z-index: 19891016; width: 150px; height: 100px; top: 10px; left: 15px;display: none">
        <!--昨日新增用户-->
        <div class="layui-card-body layuiadmin-card-list">
            <p><strong>{:Lang('new_users_today')}</strong></p>
            <p>{:Lang('new_users_today_regist')}:{if $statistics_today}{$statistics_today.regist_ios+$statistics_today.regist_android+$statistics_today.regist_pc} {else/}0{/if}</p>
            <p>&nbsp;</p>
            <p><strong>{:Lang('new_users_yesterday')}</strong></p>
            <p>{:Lang('new_users_yesterday_regist')}:{if $statistics_yesterday}{$statistics_yesterday.regist_ios+$statistics_yesterday.regist_android+$statistics_yesterday.regist_pc}{else/}0{/if}</p>
        </div>
    </div>

    <div class="layui-layer layui-layer-dialog" onmouseout="mouseout('popUp_c')" type="dialog" id="popUp_c" times="2" showtime="0" contype="string" style="z-index: 19891016; width: 150px; height: 100px; top: 10px; left: 15px;display: none">
        <!--今日活跃用户-->
        <div class="layui-card-body layuiadmin-card-list">
            <p><strong>{:Lang('today_active_users')}</strong></p>
            <p>{:Lang('today_launch_to_live_room_users')}:{$active_user}</p>
            <!--<p>{:Lang('today_launch_to_live_room_users')}:{if $statistics_today} {$statistics_today.launch_ios+$statistics_today.launch_android}{else/}0{/if}</p>-->
            <p>&nbsp;</p>
            <p><strong>{:Lang('yesterday_active_users')}</strong></p>
            <p>{:Lang('yesterday_launch_to_live_room_users')}:{$active_user_yesterday}</p>
        </div>
    </div>
    <div class="layui-layer layui-layer-dialog" onmouseout="mouseout('popUp_d')" type="dialog" id="popUp_d" times="2" showtime="0" contype="string" style="z-index: 19891016; width: 150px; height: 100px; top: 10px; left: 15px;display: none">
        <!--本月新增-->
        <div class="layui-card-body layuiadmin-card-list">
            <p><strong>{:Lang('new_users_current_month')}</strong></p>
            <p>{:Lang('new_users_regist_current_month')}:{$month_ios+$month_android+$month_pc}</p>
            <p>&nbsp;</p>
            <p><strong>{:Lang('user_total')}</strong></p>
            <p>{:Lang('user_total')}:{$user_count}</p>
        </div>
    </div>

    <div class="layui-layer layui-layer-dialog" onmouseout="mouseout('popUp_e')" type="dialog" id="popUp_e" times="2" showtime="0" contype="string" style="z-index: 19891016; width: 150px; height: 100px; top: 10px; left: 15px;display: none">
        <!--新增注册用户-->
        <div class="layui-card-body layuiadmin-card-list">
            <?php $i = 0;?>
            <?php foreach($month_list['reg'] as $key => $value){ ?>
            <p><?php
            if ($i < 10) {echo date('Y-m-d ', strtotime($key)) . Lang("new_users_registed").':'. $value;} $i++;?></p>
            <?php }?>
        </div>
    </div>

    <div class="layui-layer layui-layer-dialog" onmouseout="mouseout('popUp_f')" type="dialog" id="popUp_f" times="2" showtime="0" contype="string" style="z-index: 19891016; width: 150px; height: 100px; top: 10px; left: 15px;display: none">
        <!--活跃-->
        <div class="layui-card-body layuiadmin-card-list">
            <?php $i = 0;?>
            <?php foreach($active_users_idx_date as $key => $value){ ?>
            <p><?php
            if ($i < 10) {echo date('Y-m-d ', strtotime($key)) . Lang('active_users') .':' . $value;} $i++;?></p>
            <?php }?>
        </div>
    </div>

    <div class="layui-layer layui-layer-dialog" onmouseout="mouseout('popUp_g')" type="dialog" id="popUp_g" times="2" showtime="0" contype="string" style="z-index: 19891016; width: 150px; height: 100px; top: 10px; left: 15px;display: none">
        <!--今日活跃用户-->
        <div class="layui-card-body layuiadmin-card-list">
            <div class="layui-card-body layuiadmin-card-list">

            </div>
        </div>
    </div>
</div>

<script src="/layuiadmin/layui/layui.js"></script>
<script src="/static/jquery.min.js"></script>
<script>
    console.log({$month_day});
    layui.config({
        base: '/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'table'], function(){
        var $ = layui.$;
        $(window).resize(function () {
            var id = '';
            $(".layui-layer-dialog").each(function(){
                if($(this).css("display")=="block"){
                    id = $(this).attr('id');
                }
            });

            if (!id) {
                return false;
            }

            if ($('#p_' + id).width() < $("#" + id).width()) {
                $("#" + id).hide();
                return false;
            }

            var height = $('#p_' + id).offset().top;
            var height_a = $(this).scrollTop();

            var left = $('#p_' + id).offset().left;

            if ( height_a > height) {
                $("#" + id).hide();
            } else {
                $("#" + id).css('top', parseInt(height - height_a) + 'px');
                $("#" + id).css('left', parseInt(left) + 'px');
            }

        });

        $(window).scroll(function () {
            var id = '';
            $(".layui-layer-dialog").each(function(){
                if($(this).css("display")=="block"){
                    id = $(this).attr('id');
                }
            });

            if (!id) {
                return false;
            }

            var height = $('#p_' + id).offset().top;
            var height_a = $(this).scrollTop();

            if ( height_a > height) {
                $("#" + id).hide();
            } else {
                $("#" + id).css('top', parseInt(height - height_a) + 'px');
            }
        });
    });

    function over(id) {
        var obj = document.getElementById(id);
        var p_obj = document.getElementById('p_' + id);
        obj.style.width = p_obj.offsetWidth + 'px';
        obj.style.height = p_obj.offsetHeight + 'px';
        obj.style.top = parseInt($(p_obj).offset().top - $(this).scrollTop()) + 'px';
        obj.style.left = parseInt($(p_obj).offset().left - $(this).scrollLeft()) + 'px';
        //$('#p_' + id).unbind("mouseover");
        obj.style.display = 'block';
    }

    function mouseout(id) {
        document.getElementById(id).style.display = "none";
    }
</script>
</body>
</html>
